
<template>
	<div>
		<view class="cu-bar bg-white search fixed">
			<view class="search-form round">
				<text class="icon-search"></text>
				<u-search :show-action="false" :clearabled="true" shape="square" height="50" placeholder="输入关键字搜索" v-model="searchStr" @search="search"></u-search>
			</view>
			<view class="action u-pr-5">
				<u-button type="primary" size="mini" shape="square" @click="search">搜索</u-button>
			</view>
		</view>
		
		<div class="u-pt-50">
			<div style="margin: 15rpx;" v-for="(item, index) in DemandList" @click="seeDetails(item)">
				<div class="main-content u-col-center u-mb-5 u-pt-10">
					<!-- <div class="head-portrait">
						<img :src="item.avatarUrl" alt="">
					</div> -->
					<div class="u-title">
						{{item.subject}}
					</div>
					<div class="u-text">
						测评需求编号：{{item.demandNo}}
					</div>
					
					<div class="u-text">
						最后更新时间：{{item.updateTime}}
					</div>			
				</div>
				<div class="split-line"></div>
			</div>
		</div>
		
		<!-- 测评需求详情 -->
		<u-modal v-model="show_details" title="测评需求详情" @confirm="ConfirmSelect" show-cancel-button :mask-close-able="true">
			
			<div class="mod-content">
				<div class="split-line">
					<div class="box1">A级测评报酬(元)：</div>
					<div class="box2">{{selectItem.levelAReward}}</div>
				</div>
				
				<div class="split-line">
					<div class="box1">A级名额(人)：</div>
					<div class="box2">{{selectItem.levelAQuota}}</div>
				</div>
			
				<div class="split-line">
					<div class="box1">A级评级标准：</div>
					<u-parse style="font-size: small;" :html="this.escape2Html(selectItem.levelACriterion)"></u-parse>
				</div>
				
				<div class="split-line">
					<div class="box1">B级测评报酬(元)：</div>
					<div class="box2">{{selectItem.levelBReward}}</div>
				</div>
				
				<div class="split-line">
					<div class="box1">B级名额(人)：</div>
					<div class="box2">{{selectItem.levelBQuota}}</div>
				</div>
							
				<div class="split-line">
					<div class="box1">B级评级标准：</div>
					<u-parse style="font-size: small;" :html="this.escape2Html(selectItem.levelBCriterion)"></u-parse>
				</div>
				
				<div class="split-line">
					<div class="box1">C级测评报酬(元)：</div>
					<div class="box2">{{selectItem.levelCReward}}</div>
				</div>
				
				<div class="split-line">
					<div class="box1">C级名额(人)：</div>
					<div class="box2">{{selectItem.levelCQuota}}</div>
				</div>
				
				<div class="split-line">
					<div class="box1">C级评级标准：</div>
					<u-parse style="font-size: small;" :html="this.escape2Html(selectItem.levelCCriterion)"></u-parse>
				</div>
				
				<div class="split-line">
					<div class="box1">测评总费用(元)：</div>
					<div class="box2">{{selectItem.purchasePrice}}</div>
				</div>
				
				<div class="split-line">
					<div class="box1">测评总人数(人)：</div>
					<div class="box2">{{selectItem.joinQuota}}</div>
				</div>
				
				<div class="split-line">
					<div class="box1">测评要求设置：</div>
					<u-parse :html="this.escape2Html(selectItem.remarks)"></u-parse>
				</div>
				
				<div class="split-line">
					<div class="box1">验收要求设置：</div>
					<u-parse :html="this.escape2Html(selectItem.requirements)"></u-parse>
				</div>
				
			</div>

		</u-modal>
		
	</div>
</template>

<script>
	export default {
		data() {
			return {
				DemandList: [],
				searchStr: '',
				pageNum: 1,
				pageSize: 20,
				show_details: false,
				selectItem: {}
			};
		},

		onLoad(options) {
			// 获取测评需求列表
			this.getDemandList();
		},
		
		onPullDownRefresh() {
			this.refreshData();
			// 停止Loading
			uni.stopPullDownRefresh();
		},
		  
		onReachBottom() {
			this.pageNum += 1
			this.getDemandList();
		},

		methods: {

			/**
			 * 获取测评需求列表
			 */
			async getDemandList() {
				
				/* const userInfo = uni.getStorageSync('userInfo')
				let result = await this.$u.api.unifyRequest({
					userId: userInfo.userId,
					nickName: userInfo.nickName,
					appid: 'ProductPromote',
					wf_num: 'R_ProductPromote_B013',
					searchStr: this.searchStr,
					pageNum: this.pageNum,
					pageSize: this.pageSize,
					loading: false // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					if(this.pageNum != 1){
						this.DemandList = this.DemandList.concat(result.data)
					}else{
						this.DemandList = result.data
					}
				} else {
					this.showMSG('error', '获取数据出错了！');
					setTimeout(() => {
						this.goBack()
					}, 1500);
				} */
				
				const userInfo = uni.getStorageSync('userInfo');
				let result = await this.$u.api.unifyMiniRest({
					systemid: "meily",
					url: "/evaluation/list",
					searchStr: this.searchStr,
					pageNum: this.pageNum,
					pageSize: this.pageSize,
					loading: false
				});
				if (result.code == 200) {
					if(this.pageNum != 1){
						this.DemandList = this.DemandList.concat(result.rows)
					}else{
						this.DemandList = result.rows
					}
				} else {
					this.showMSG('error', '获取数据出错了！');
					setTimeout(() => {
						this.goBack()
					}, 1500);
				}
			},
			
			/**
			 * 搜索
			 */
			async search(){
				this.pageNum = 1;
				this.getDemandList();
			},
			
			/**
			 * 点击查看测评需求详情
			 */
			async seeDetails(item){
				// this.$u.route('/pages_private_scene2/ProductPromote/common/DemandDetails?DemandUnid=' + item.id);
				this.$u.route('/pages_private_scene2/ProductPromote/common/DemandDetails?demand=' + encodeURIComponent(JSON.stringify(item)));
			},
			
			/**
			 * 点击查看测评需求详情
			 */
			async seeDetails_old(item){
				this.selectItem = item;
				this.show_details = true;
			},
			
			/**
			 * 确定选中，则返回
			 */
			async ConfirmSelect() {
				uni.$emit("saveDemand", this.selectItem);
				this.goBack();
			},
		}

	}
</script>

<style scoped>
	.bg-white {
		background-color: #fff;
		color: #666;
	}
	
	.cu-bar {
		display: flex;
		position: relative;
		align-items: center;
		min-height: 100rpx;
		justify-content: space-between;
	}

	.cu-bar.fixed, .nav.fixed {
		position: fixed;
		width: 100%;
		top: 0;
		z-index: 1024;
		box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.1);
	}
	
	.cu-bar .search-form {
		background-color: #f5f5f5;
		line-height: 64rpx;
		height: 64rpx;
		font-size: 24rpx;
		color: #666;
		flex: 1;
		display: flex;
		align-items: center;
		margin: 0 20rpx;
	}
	
	.round {
		border-radius: 5000rpx;
	}
	 
	.head-portrait {
		margin-right: .8em;
		width: 80px;
		height: 80px;
		line-height: 80px;
		text-align: center;
		float: left;
		display: inline;
	}
	
	.head-portrait img {
		width: 100%;
		max-height: 100%;
		vertical-align: top;
	}
	
	.main-content {
		display: inline;
		width: 80px;
		height: 80px;
	}
	
	.u-title{
		font-weight: bold;
		color: #1d1b1b;
		font-size: 30rpx;
		padding-bottom: 10rpx;
	}
	
	.u-text{
		font-size: 24rpx;
		color: #bcbcbc;
		padding-top: 15rpx;
	}
	
	.split-line {
		border-bottom:1px solid #e6e6e6;
		padding: 5px;
	}
	
	.mod-content{
		padding: 15px;
		height: 450px;
		overflow-y: scroll;
	}
	
	.box1{
		display: inline-block;
		width: 300rpx;
		font-weight: bold;
	}
	
	.box2{
		display: inline-block;
		width: 200rpx;
		text-align: end;
	}

</style>
